<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>组合选择符--后代选取器</title>
    <!--CSS 组合选择符-->
    <!--Note	组合选择符说明了两个选择器直接的关系。-->
    <!--CSS组合选择符包括各种简单选择符的组合方式。-->
    <!--在 CSS3 中包含了四种组合方式:-->
    <!--后代选取器(以空格分隔)-->
    <!--子元素选择器(以大于号分隔）-->
    <!--相邻兄弟选择器（以加号分隔）-->
    <!--普通兄弟选择器（以破折号分隔）-->
    <!--后代选取器-->
    <!--后代选取器匹配所有值得元素的后代元素。-->
    <!--以下实例选取所有 <p> 元素插入到 <div> 元素中:-->
    <style>
        div p
        {
            background-color: yellow;
        }
    </style>
    </head>
<body>
<div>
    <p>段落1.在div中。</p>
    <p>段落2.在div中。</p>
</div>

<p>段落3.不在div中。</p>
<p>段落4.不在div中。</p>
</body>
</html>